<template>
  <!-- 山东(首页)-->
  <div class="fluid">
    <el-breadcrumb class="bread" separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/Campus' }">课程服务</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/loginCourse' }">走进校园</el-breadcrumb-item>
      <el-breadcrumb-item>校内正式课</el-breadcrumb-item>
      <el-breadcrumb-item>山东</el-breadcrumb-item>
      <el-breadcrumb-item>查看更多</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="imags"></div>
    <div class="siz">
      <p class="header0">山东</p>
      <div class="xm"></div>
      <p
        class="header00"
      >2018年上半年，山东的章丘四中在信息技术课上使用了哈工科教自主研发的软硬件素材。同学们在这样的课堂上变得更加专注认真。这样软件学习与硬件拼接相结合的教学形式相比于以往的理论课程让同学们体会到了更大的乐趣和成就感。每次课程的结束学生都能完成自己的一个小作品，给学生带来了很大的学习动力。</p>
    </div>
    <ul clss="ula">
      <li class="liad" v-for="item in img" :key="item.id">
        <img :src="item.images" alt="">
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "xiamen",
  data(){
    const img =[
      {
        images:"https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/30-img.png"
      },
      {
        images:"https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/31-img.png"
      },
      {
        images:"https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/32-img.png"
      }
    ]
  return{
    img
  }
  }
};
</script>

<style scoped>
.fluid {
  min-width: 1200px;
  margin: 0 auto;
  margin-top: 235px;
}
.bread {
  margin-bottom: 60px;
}
.imags {
  width: 1200px;
  height: 565px;
  background:no-repeat url("https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/29-img.png");
  margin-bottom: 60px;
}
.siz {
  width: 1200px;
  height: 247px;
  margin: 0 auto;
  margin-bottom: 169px;
}
.header0 {
  text-align: center;
  font-family: "黑体";
  font-size: 30px;
  font-weight: normal;
  font-stretch: normal;
  line-height: 41px;
  letter-spacing: 0px;
  color: #525252;
  margin-bottom: 22px;
}
.header00 {
  font-family:"黑体";
  font-size: 22px;
  letter-spacing: 0px;
  color: #999999;
  text-indent: 39px;
  line-height: 41px;
  margin-bottom: 0;
  text-align: justify;
}
.liad{
  height: 560px;
  background: pink;
  margin-bottom: 100px;
}
.xm{
  width: 20px;
	height: 3px;
	background-color: #08aaff;
  margin: 0 auto;
  margin-bottom: 50px;
}
</style>
